<title>旺进财</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<script type="text/javascript" src="#(assets)/js/jquery-2.2.4.min.js"></script>
<script type="text/javascript" src="#(assets)/js/jquery.tmpl.min.js"></script> 
<script src="#(assets)/js/TouchSlide.1.1.js"></script>
<script type="text/javascript" src="#(assets)/js/layer/layer.js"></script>
<link rel="stylesheet" href="#(assets)/css/swiper.min.css"> 
<style> 
	body{font-family:"Microsoft YaHei",Arial,Helvetica,sans-serif,"宋体";}
	li{list-style-type:none;}
	/* 轮播本例子css -------------------------------------- */
	.focus{ width:100%; height:170px;  margin:0 auto; position:relative; overflow:hidden;   }
	.focus .hd{ width:100%; height:11px;  position:absolute; z-index:1; bottom:5px; text-align:center;  }
	.focus .hd ul{ display:inline-block; height:5px; padding:3px 5px; ; 
		-webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; font-size:0; vertical-align:top;
	}
	.focus .hd ul li{ display:inline-block; width:5px; height:5px; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; background:#FFF; margin:0 5px;  vertical-align:top; overflow:hidden;   }
	.focus .hd ul .on{ background:#8C8C8C;  }

	.focus .bd{ position:relative; z-index:0; }
	.focus .bd li img{ width:100%;  height:170px; background:url(images/loading.gif) center center no-repeat;  }
	.focus .bd li a{ -webkit-tap-highlight-color:rgba(0, 0, 0, 0); /* 取消链接高亮 */  }
</style>

 
<body bgcolor="#f4f5f9" style="margin:0px;">
	<div id="content">
		<!-- 本例主要代码 Start ================================ -->
		<div id="focus" class="focus">
			<div class="hd">
				<ul></ul>
			</div>
			<div class="bd">
				<ul id="slider"></ul>
			</div>
		</div>
		<!-- 本例主要代码 End ================================ -->
	</div>
	<div align="center" style="width:100%;height:75px;background:#fff;">

		<div  style="width:90%;height:30px;font-size:12px;border-top:1px solid #f1f4fb;margin-top:5px;">
			<!--<div onclick="window.location.href='#(path)/app/page/index-statement?type=depository'" style="width:25%;float:left;padding-top:5px;">  
				<div><img style="width:30px" src="#(assets)/images/mobile/index_yhcg.png"></div>
				<div style="line-height:30px;">银行存管</div>
			</div>-->
			<div onclick="window.location.href='#(path)/app/page/index-statement?type=security'" style="width:33.3%;float:left;padding-top:5px;">
				<div><img style="width:30px" src="#(assets)/images/mobile/index_zjaq.png"></div>
				<div style="line-height:30px;">资金安全</div>
			</div>
			<div onclick="window.location.href='#(path)/app/page/index-statement?type=protect'" style="width:33.3%;float:left;padding-top:5px;">
				<div><img style="width:30px" src="#(assets)/images/mobile/index_xxbh.png"></div>
				<div style="line-height:30px;">信息保护</div>
			</div>
			<div onclick="window.location.href='#(path)/app/page/index-statement?type=control'" style="width:33.3%;float:left;padding-top:5px;">
				<div><img style="width:30px" src="#(assets)/images/mobile/index_fktx.png"></div>
				<div style="line-height:30px;">风控体系</div>
			</div>
		</div>
		 
	</div> 
	
	<!--测试滑动-->
	<div id="swiper-container" class="swiper-container"  style="margin-top:8px;width:95%;">
        <div id="swiper-wrapper" class="swiper-wrapper">

        </div>
		
    </div>
	<div align="center" style="line-height:20px;font-size:12px;color:#666;margin-bottom:60px;">市场有风险，投资需谨慎</div>

	<!--菜单-->
	<div align="center" style="clear:both;position:fixed;bottom:0px;height:57px;width:100%;border-top:1px solid #d2d2d2;background:#FFF;z-index:1000">
		<div style="color:#fa3048;float:left;width:33.3%;height:50px;border-bottom:2px solid #fa3048;padding-bottom:5px" onclick="window.location.href='/app/page/index-index'">
			<img style="height:25px;margin-top:5px;" src="#(assets)/images/mobile/menu_12.png">
			<div style="font-size:12px;margin-top:5px;">推荐</div>
		</div>
		<div style="color:#8a8a8a;float:left;width:33.3%;height:50px;padding-bottom:5px" onclick="window.location.href='/app/page/invest-investList'">
			<img style="height:25px;margin-top:5px;" src="#(assets)/images/mobile/menu_21.png">
			<div style="font-size:12px;margin-top:5px;">投资</div>
		</div>
		<div style="color:#8a8a8a;float:left;width:33.3%;height:50px;padding-bottom:5px" onclick="window.location.href='/app/page/personal-personal'">
			<img style="height:25px;margin-top:5px;" src="#(assets)/images/mobile/menu_31.png">
			<div style="font-size:12px;margin-top:5px;">我的</div>
		</div>
	</div>
	
<script id="dataindex" type="text/x-jquery-tmpl">
	<div align="center" class="swiper-slide" style="clear:both;background:url(#(assets)/images/mobile/index_xmbj.png) no-repeat 1% 1%;background-position:1% 1%;background-size:100% 100%;">
		<div  style="margin-top:15px;font-size:18px" >${name}<img id="img${id}" ${hide} style="width:14px;margin-left:10px;" src="#(assets)/images/mobile/index_closed.png"></div> 
		<div style="color:#807e7f;font-size:14px;margin-top:20px">预期年化</div>
		<div  style="font-size:32px;color:#fa3048;">${rate}%</div>
		<div style="font-size:14px;color:#8f8f8f">
			<img style="width:13px;" src="#(assets)/images/mobile/index_fire.png">
			<a>${summary}</a>
		</div>
		<div style="font-size:14px;margin-top:5px;">
			<div style="width:27%;border-right:1px solid #d0d0d0;float:left"><a style="color:#fa3048">${day_limit}天</a>期限</div>
			<div style="width:45%;border-right:1px solid #d0d0d0;float:left">剩余可投<a  style="color:#fa3048">${shengyu}</a>元</div>
			<div style="width:27%;float:left;font-size:12px;">${unit_amount}</a></div>
		</div>
		<div style="clear:both;height:20px;line-height:20px;font-size:13px;color:#8f8f8f">
			完成度<a>${jindu}%</a>
		</div>
		<div style="width:90%;">
			<div style="float:left;width:100%;height:20px;overflow:hidden;position:relative;">
				<div style="position:relative;float:left;margin-top:9px;height:2px;width:100%;background:#fa3048">
					<div id="jdt${id}" style="position:relative;float:left;height:2px;width:100%;background:#eee"></div>
				</div>
			</div>
		</div>
		<div onclick="window.location.href='/app/page/invest-investDetail?id=${id}'" style="width:80%;border:2px solid #fa3048;border-radius:10px;line-height:30px;height:30px;margin-top:20px;color:#fa3048"><a>立即投资</a></div>
	</div>
</script>
<script src="#(assets)/js/swiper.jquery.min.js"></script>
<script type="text/javascript"> 
$(document).ready(function(){ 
	$.getJSON("/bid/home", function(index_data) {
		console.log(index_data.data.bids);
		var indexdata = index_data.data.bids;
		$.each(indexdata, function(i, item){ 	
			var shengyu = Number(item.amount) - (Number(item.avunit) * Number(item.unit_amount));
			var jindu = (Number(item.avunit) * Number(item.unit_amount)*100/ Number(item.amount)).toFixed(2);
	
			if(item.is_direct==0){
				var hide="hidden";
			}
			if(item.type=="experi"){
				var unit_amount = "单次仅限一张";
			}else{
				var unit_amount = "每份"+item.unit_amount+"元";
			}
			var datalist = {hide:hide,id:item.id,name:item.name,rate:item.rate,summary:item.summary,day_limit:item.day_limit,unit_amount:unit_amount,shengyu:shengyu,jindu:jindu};
			$("#dataindex").tmpl(datalist).appendTo('#swiper-wrapper');
			$("#jdt"+item.id).animate({left:jindu+"%"},1000);
		});
		//推荐标的加载
		var swiper = new Swiper('.swiper-container');
		// 加载轮播图
		var imgurl = "";
		$.each(index_data.data.sliders,function(i,item){
			imgurl += "<li><a href="+item.link+"><img _src='"+item.pic+"'/></a></li>";
		});
		$("#slider").html(imgurl);
		TouchSlide({ 
			slideCell:"#focus",
			titCell:".hd ul", //开启自动分页 autoPage:true ，此时设置 titCell 为导航元素包裹层
			mainCell:".bd ul", 
			effect:"left", 
			autoPlay:true,//自动播放
			autoPage:true, //自动分页
			switchLoad:"_src" //切换加载，真实图片路径为"_src" 
		});
		
	});
	
	
	//浏览器当前窗口可视区域高度 
	var index_height = $(window).height();

	var index_height = (index_height)*0.28;
	var index_height = index_height;
	$(".swiper-container").css("height",index_height);
	var index_top = parseInt(index_height) * 0.7 * 100 / 530 / 2 + "px";
	var index_top2 = parseInt(index_height) * 0.7 * 100 / 530/1.5 + "px"; 
	$("#swiper-contaier").css("height",index_height);
	$("#realname").css("margin-top",index_top);
	$(".index_top").css("margin-top",index_top2);
	// 进度条加载
});
</script>
</body>